{% extends "pc.master.default.html" %}
{%load encoding%}

{% block include %}
<link rel="stylesheet" href="/resources/css/sheet.css" type="text/css" />

<script type="text/javascript" src="/resources/3th/jstree_pre1.0_fix_1/jquery.jstree.js" ></script>
<script type="text/javascript" src="/resources/3th/jstree_pre1.0_fix_1/_lib/jquery.cookie.js" ></script>
{% endblock %}


{% block script %}
$(function () {
    $("#demo1").jstree({
        "plugins" : [ "themes", "json_data", "ui", "search", "types" ],
        "json_data" : {
            "ajax" : {
                "url" : "/dept/ajax/",
                "data":function(n){

                    return {
                        "operation":"get_child",
                        "super_dept_code" : n.attr ? n.attr("id") : ""
                    };
                }
            }
        },
        "core": {
            "open_parents": true,
            //"initially_open": ["root", "D001"]
            "initially_open": ["root"]
        },

        "search" : {
            "ajax":{
                "url":"/dept/ajax/",
                "data":function(str){
                    return{
                        "operation":"search",
                        "search_str":str};
                }
            }
        },
        "types":{
            /*"max_depth":-2,
            "max_childrend":-2,*/
            "valid_children" : [ "drive" ],
            "types":{
                "default":{
                    "valid_children":"none",
                    "icon":{"image":"/resources/3th/jstree_pre1.0_fix_1/_demo/file.png"}

                },
                "folder":{
                    "valid_children":["default", "none"],
                    "icon":{"image":"/resources/3th/jstree_pre1.0_fix_1/_demo/folder.png"}
                },
                "driver":{
                    "valid_children":["default", "none"],
                    "icon":{"image":"/resources/3th/jstree_pre1.0_fix_1/_demo/root.png"}
                }
            }
        }

    }).bind("select_node.jstree",
        function (e, data) {
            //alert(data.rslt.obj.data("id"));
            $("#deptCode").val(data.rslt.obj.data("id"));

            //alert("@" + data.rslt.obj.data("description"));
            $("#description").val(data.rslt.obj.data("description"));
        }).bind("loaded.jstree", function(e,data) {
            //alert("@");

        })
        ;
    })



    ; // end of jstree



$(document).ready(function(){
    $("#btnSearch").click(function(){
        $("#demo1").jstree("search", $("#search").val());
    });

    $("#search").keydown(function(e) {
        if (e.keyCode == 13) {
            $("#btnSearch").click();
        }
    });

}); // end of ready

{% endblock %}

{%block body %}

<div>
    <h3>Dept Tree</h3>
</div>
    <input type="text" id="search" />
    <button id="btnSearch">SEARCH</button>

    <table>
        <tr>
            <td>
                <div id="demo1" ></div>
            </td>
            <td>
                <div id="deptInfo">
                <ul>
                    <li>부서코드</li>
                    <li><input type="text" id="deptCode" /></li>

                    <li>부서명</li>
                    <li><input type="text" id="description"/></li>
                </ul>
                </div>

            </td>
        </tr>
    </table>


{% endblock %}
